<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        #main{
            width: 60%;
            height: 1000px;
            margin: 0 auto;    
        }
        #d1,#d2,#d3,#d4,#d5,#d6{
            width: 200px;
            height: 400px;
            border: 1px solid rgb(19, 200, 19);
            border-radius: 5px;
            float: left;
            margin-left: 20px;
            margin-top: 20px;
            text-align: center;
        }
        img{
            width: 140px;
            height: 200px;
        }
        .p1{
            color: red;
        }
        .p2{
            width: 200px;
            height: 75px;
            text-indent: 2em;
            text-align: left;
            margin-left: 3px;
        }
        .p3{
            color: rgb(255, 255, 255);
            background-color: red;
            width: 80px;
            height: 25px;
            float: left;
            margin-left: 10px;            
        }
        .p4{
            width: 80px;
            height: 25px;
            color: rgb(255, 255, 255);
            background-color: rgb(21, 21, 235);
            float: left;
            margin-left: 10px;         
        }

    </style>
</head>
<body>
    <div id="main">
        <div id="d1">
            <img src="1.jpg">
            <p class="p1">￥5999.00</p>
            <p class="p2">iPhone&nbsp;11&nbsp;(A2223)<br>128GB绿色&nbsp;移动联通电信4G手机&nbsp;双卡双待</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>

        <div id="d2">
            <img src="2.jpg">
            <p class="p1">￥10899.00</p>
            <p class="p2">iPhone&nbsp;11&nbsp;Pro&nbsp;Max<br>(A2220)256GB&nbsp;深空灰色<br/>移动联通电信4G手机&nbsp;双卡双待</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>

        <div id="d3">
            <img src="3.jpg">
            <p class="p1">￥4999.00</p>
            <p class="p2">iPhone&nbsp;XR&nbsp;(A2108)<br>128GB&nbsp;红色&nbsp;移动联通电信4G手机&nbsp;双卡双待</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>

        <div id="d4">
            <img src="4.jpg">
            <p class="p1">￥5799.00</p>
            <p class="p2">Mate&nbsp;30&nbsp;Pro&nbsp;麒麟990<br>旗舰芯片OLED环幕频双4000万徕卡电影四摄8GB+128GB星河银4G手机</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>

        <div id="d5">
            <img src="5.jpg">
            <p class="p1">￥4998.00</p>
            <p class="p2">P30&nbsp;Pro&nbsp;超感光徕卡四<br>摄10倍混合变焦麒麟980芯<br>片屏内指纹8GB+128GB天<br>空之境全网通版双4G手机</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>

        <div id="d6">
            <img src="6.jpg">
            <p class="p1">￥3988.00</p>
            <p class="p2">P30&nbsp;超感光徕卡三摄麒<br>麟980AI智能芯片全面屏屏<br>内指纹版手机8GB+128GB<br>天空之境全网通双4G手机</p>
            <p class="p3">加入购物车</p>
            <p class="p4">立即购买</p>
        </div>
    </div>    
</body>
</html>